var MachineProcessTable = function () {
  var template = /* html */ `
    <div class="machine-process-table">
      <table ref="table" cellspacing="0" cellpadding="0">
        <thead>
          <tr>
            <th style="min-width:50px">车间</th>
            <th style="min-width:70px">设备名称</th>
            <th style="min-width:70px">日利用率</th>
            <th style="min-width:70px">月利用率</th>
            <th style="min-width:70px">年利用率</th>
            <th style="min-width:65px">月产能</th>
            <th style="min-width:65px">年产能</th>
            <th v-for="machineProDate in machineProDateList" :key="'date_'+machineProDate" style="min-width:45px">
              {{machineProDate}}
            </th>
          </tr>
        </thead>
        <tbody>
          <tr v-for="(machinePro,index) in machineProList" :key="'machinePro_'+index">
            <td>{{machinePro.workShopName}}</td>
            <td>{{machinePro.equipmentNo}}</td>
            <td>{{machinePro.dayRate}}%</td>
            <td>{{machinePro.monthRate}}%</td>
            <td>{{machinePro.yearRate}}%</td>
            <td>{{machinePro.monthCount}}</td>
            <td>{{machinePro.yearCount}}</td>
            <td v-for="machineProDate in machineProDateList" :key="'date_'+machineProDate" style="min-width:45px">
              {{getDateCapacity(machinePro,machineProDate)}}
            </td>
          </tr>
        </tbody>
      </table>
    </div>
  `;

  return {
    props: {
      machineProData: {
        type: Object,
        requiresd: true
      }
    },

    inject: ['workProcedureBoard'],

    watch: {
      changeData: function (newData, oldData) {
        if (newData.rowIndex !== oldData.rowIndex || newData.colIndex !== oldData.colIndex) {
          this.setMachineProList();
          this.setMachineProDateList();
          return;
        }

        var proList = newData.machineProList;
        var proDateList = newData.machineProDateList;
        if (newData.rowIndex >= proList.length || newData.colIndex >= proDateList.length) {
          this.rowIndex = 0;
          this.colIndex = 0;
        } else {
          this.setMachineProList();
          this.setMachineProDateList();
        }
      }
    },

    computed: {
      changeData: function () {
        var machineProData = this.machineProData;
        return {
          rowIndex: this.rowIndex,
          colIndex: this.colIndex,
          machineProList: machineProData.searchMachineProList,
          machineProDateList: machineProData.machineProDateList
        }
      }
    },

    data: function () {
      return {
        rowIndex: 0,
        colIndex: 0,
        machineProList: null,
        machineProDateList: []
      };
    },

    mounted: function () {
      this.setMachineProList();
      this.setMachineProDateList();

      var self = this;
      $(this.$el).resize(function () {
        self.workProcedureBoard.clearTimeoutList(1);
        self.changeRowIndex(true);
        self.changeColIndex(true);
        self.workProcedureBoard.resetTableRunning();
      });
    },

    methods: {
      setMachineProList: function () {
        var rowIndex = this.rowIndex;
        var machineProData = this.machineProData;
        var machineProList = machineProData.getChartMachineProList(rowIndex);
        this.machineProList = machineProList;
      },

      setMachineProDateList: function () {
        var colIndex = this.colIndex;
        var machineProData = this.machineProData;
        var machineProDateList = machineProData.getChartMachineProDateList(colIndex);
        this.machineProDateList = machineProDateList;
      },

      getDateCapacity: function (machinePro, date) {
        var capacityObj = machinePro.capacityObj;
        var obj = capacityObj[date];
        if (obj === undefined) {
          return 0;
        }

        return obj.capacity;
      },

      tableRunning: function () {
        this.changeRowIndex();
        this.changeColIndex();
      },

      changeRowIndex: function (hasResize) {
        var hasScroll = this.workProcedureBoard.checkHasScroll();
        if (!hasScroll) {
          this.rowIndex = 0;
          return;
        }

        if (hasResize) {
          return;
        }

        var machineProList = this.machineProList;
        var maxRow = machineProList.length;
        var rowIndex = this.rowIndex;
        rowIndex += 1;
        if (rowIndex >= maxRow) {
          rowIndex = 0;
        }
        this.rowIndex = rowIndex;
      },

      changeColIndex: function (hasResize) {
        var $table = $(this.$refs['table']);
        var tableWidth = $table.width();
        var warpWidth = $(this.$el).width();
        if (warpWidth >= tableWidth) {
          this.colIndex = 0;
          return;
        }

        if (hasResize) {
          return;
        }

        var machineProDateList = this.machineProDateList;
        var maxCol = machineProDateList.length;
        var colIndex = this.colIndex;
        colIndex += 1;
        if (colIndex >= maxCol) {
          colIndex = 0;
        }
        this.colIndex = colIndex;
      }
    },

    template: template
  };
}();
